<template>
  <div class="page">
    <h2 >{{ title }}</h2>
    <div class="panel">
      <div class="mb-2 text-center text-base">官网管理平台</div>
      <login-password/>
      <!-- <a-tabs v-model:active-key="activeKey">
       <a-tab-pane key="scan">
         <template #tab>
           <icon-font type="wechat"/>
           微信扫码
         </template>
         <login-wx-open />
       </a-tab-pane>
        <a-tab-pane key="password">
          <template #tab>
            <lock-two-tone/>
            密码登录
          </template>
          <login-password/>
        </a-tab-pane>
       <a-tab-pane key="smsCode">
         <template #tab>
           <mobile-two-tone/>
           短信验证码
         </template>
         <login-sms-code/>
       </a-tab-pane>
      </a-tabs> -->
    </div>
  </div>
</template>
<script setup>
import LoginPassword from "./components/login-password.vue";

const activeKey = ref('password');
const title = import.meta.env.VITE_TITLE;
</script>
<style lang="scss" scoped>
.page {
  height: 100vh;
  box-sizing: border-box;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: url('../assets/img/bridge.png') no-repeat bottom center;
  background-size: 100%;
}

.panel {
  width: 420px;
  padding: 16px 32px;
  background-color: rgba(255,255,255,0);
  border: 0px solid rgb(237, 242, 245);
  border-radius: 6px;
  box-shadow: rgba(0, 0, 0, 0.08) 0 7px 20px;
  transition: all 0.2s linear 0s;
}
.text-base {
  color: white;
}
h2 {
  text-align: center;
  font-size: 24px;
  margin-bottom: 24px;
  color: white;
}

.submit {
  margin: 12px 0;
}
</style>
